import React from 'react';
import { Space, Typography } from 'antd';
import { InfoCircleOutlined } from '@ant-design/icons';
import { t } from '@/locales/i18n';
const { Text } = Typography;

interface VariableTipProps {
  style?: React.CSSProperties;
  className?: string;
}

const VariableTip: React.FC<VariableTipProps> = ({ style, className, ...props }) => {
  return (
    <Space
      size={4} // equivalent to spacing={1} (assuming 1 = 4px)
      style={{
        fontSize: '11px',
        ...style,
      }}
      className={className}
      {...props}
    >
      <InfoCircleOutlined style={{ fontSize: '12.8px' }} /> {/* 0.8rem ≈ 12.8px */}
      {/* <Text>{t('textarea_variable_picker_tip')}</Text> */}
    </Space>
  );
};

export default VariableTip;
